<template>
  <i-count-up :endVal="endVal" :options="options" @ready="ready"></i-count-up>
</template>

<script>
import ICountUp from 'vue-countup-v2'
export default {
  name: 'AniCountTo',
  components: {
    ICountUp
  },
  props: {
    delay: {
      type: Number,
      default: 0
    },
    endVal: {
      type: Number,
      default: 0
    },
    options: {
      type: Object,
      default: () => {
        return {
          startVal: 0,
          useEasing: true,
          useGrouping: true,
          separator: '',
          decimal: '',
          prefix: '',
          suffix: '',
          duration: 0,
          decimalPlaces: 0,
          smartEasingThreshold: 0,
          smartEasingAmount: 0
        }
      }
    }
  },
  data () {
    return {
      instance: null
    }
  },
  mounted () {
  },
  methods: {
    ready (instance) {
      this.instance = instance
    },
    start () {
      if (this.instance) this.instance.start()
    },
    update (val) {
      if (this.instance) this.instance.update(val)
    },
    reset () {
      if (this.instance) this.instance.reset()
    },
    pauseResume () {
      if (this.instance) this.instance.pauseResume()
    }
  }
}
</script>

<style lang="stylus" scoped>
</style>
